<template>
    <div class="gasSummary">
        <div class="header">
            <text class="text">能效监测设备能耗对比分析统计表</text>
        </div>
        <!-- <div class="cont" v-html="result">
            {{result}}
        </div> -->
        <!-- <div class="cont" v-html="result">
            <div>{{result}}</div>
            <ul class="list">
                <li class="listItem">
                    <div class="titleTop"><text class="line"></text><text class="title">{{dataItem.yql_min}}</text></div>
                    <text class="contItem"></text>
                </li>
            </ul>
        </div> -->
    </div>
</template>
<script>
import event from '@/net/event'
export default {
    name: 'gasSummary',
    props: ['dataItem', 'dataList', 'result'],
    data () {
        return {
            // dataList: [
            //     {
            //         title: '合计监测60天',
            //         cont: '平均气温-6°C，平均开机户数139户，户均采暖面积 102.79平米，户均日用气量10.53立方，户均平米用气 量0.10立方'
            //     },
            //     {
            //         title: '燃气用户总趋势： 温度越低，日均用气量越高',
            //         cont: '平均气温-6°C，平均开机户数139户，户均采暖面积 102.79平米，户均日用气量10.53立方，户均平米用气 量0.10立方'
            //     }
            // ]
            // result: ''
        }
    },
    created(){
        this.result += "<div  >";
        this.result += "<div  ><B>提示分析</B></div>";
        this.result += "<div id='con_sum' >";
        
        this.result += "<div ><div >合计监测"+this.dataList.FORMATDATE+"天</div><div >平均气温"+this.dataList.ZDWD+"℃，平均开机户数"+this.dataList.KJHS+"户，户均采暖面积"+this.dataList.PJCNMJ+"平米";
        this.result += "，户均日用气量"+this.dataList.HRJL+"立方，户均平米用气量"+this.dataList.HPMYQL+"立方。</div><div >燃气用户总趋势，温度越低，日均用气量越高；</div><div >"+this.dataItem.date_min+"气温最高"+this.dataItem.wd_min+"℃，户日均用气量&nbsp;<span color='red'>"+this.dataItem.yql_min+"</span>立方；<br>"+this.dataItem.date_max+"气温最低"+this.dataItem.wd_max+"℃，户日均用气量&nbsp;<span size='2' color='red'>"+this.dataItem.yql_max+"</span>立方；";
        this.result += "</div></div></div></div>";	
    }
}
</script>
<style scoped>
.header{
    width: 750px;
    height: 100px;
    justify-content: center;
    align-items: center;
}
.text{
    font-size: 29.1px;
    font-family:PingFangSC-Regular;
    color:rgba(102,102,102,1);
}
.cont{
    width: 750px;
    justify-content: flex-start;
    align-items: center;
    margin-top: 20px;
}
.list{
    width: 700px;
    border-radius: 20px;
    background-color: #fff;
}
.listItem{
    width: 700px;
    padding-top: 25px;
    padding-bottom: 25px;
    padding-left: 25px;
    padding-right: 25px;
}
.titleTop{
    flex-direction: row;
    padding-bottom: 15px;
}
.title{
    color: rgba(62,175,252,1);
    font-family:PingFangSC-Semibold;
    font-size: 29.1px;
}
.line{
    display: block;
    width: 11px;
    height: 40px;
    background-color:  rgba(62,175,252,1);
    margin-right: 15px;
}
.contItem{
    font-size: 25px;
    font-family:PingFangSC-Regular;
    color:rgba(0,0,0,1);
}
</style>
